@import "tailwindcss";
@import "tw-animate-css";


:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
  --loginbg1:rgba(244, 111, 243);
  --loginbg2:rgba(1, 130, 231);
}

.theme-light{
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
  --loginbg1:rgba(244, 111, 243);
  --loginbg2:rgba(1, 130, 231);
}
.theme-dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.145 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.145 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.396 0.141 25.723);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --border: oklch(0.269 0 0);
  --input: oklch(0.269 0 0);
  --ring: oklch(0.439 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(0.269 0 0);
  --sidebar-ring: oklch(0.439 0 0);
  --loginbg1:rgba(180, 70, 180, 0.7);
  --loginbg2:rgba(0, 80, 160, 0.7);
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);
}

/* 春季主题 - 清新自然 */
.theme-light-spring {
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(240, 10%, 3.9%);

  /* 卡片颜色 */
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(240, 10%, 3.9%);

  /* 弹出层颜色 */
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(240, 10%, 3.9%);

  /* 主要颜色 */
  --primary: hsl(142.1, 76.2%, 36.3%);
  --primary-foreground: hsl(355.7, 100%, 97.3%);

  /* 次要颜色 */
  --secondary: hsl(240, 4.8%, 95.9%);
  --secondary-foreground: hsl(240, 5.9%, 10%);

  /* 静默颜色 */
  --muted: hsl(240, 4.8%, 95.9%);
  --muted-foreground: hsl(240, 3.8%, 46.1%);

  /* 强调色 */
  --accent: hsl(240, 4.8%, 95.9%);
  --accent-foreground: hsl(240, 5.9%, 10%);

  /* 破坏性颜色 */
  --destructive: hsl(0, 84.2%, 60.2%);
  --destructive-foreground: hsl(0, 0%, 98%);

  /* 界面元素 */
  --border: hsl(240, 5.9%, 90%);
  --input: hsl(240, 5.9%, 90%);
  --ring: hsl(142.1, 76.2%, 36.3%);

  /* 图表颜色 */
  --chart-1: hsl(12, 76%, 61%);
  --chart-2: hsl(173, 58%, 39%);
  --chart-3: hsl(197, 37%, 24%);
  --chart-4: hsl(43, 74%, 66%);
  --chart-5: hsl(27, 87%, 67%);

  /* 其他 */
  --radius: 0.5rem;
}
.theme-dark-spring  {
  /* 暗色模式基础 */
  --background: hsl(20, 14.3%, 4.1%);
  --foreground: hsl(0, 0%, 95%);

  /* 暗色模式卡片 */
  --card: hsl(24, 9.8%, 10%);
  --card-foreground: hsl(0, 0%, 95%);

  /* 暗色模式弹出层 */
  --popover: hsl(0, 0%, 9%);
  --popover-foreground: hsl(0, 0%, 95%);

  /* 暗色模式主要颜色 */
  --primary: hsl(142.1, 70.6%, 45.3%);
  --primary-foreground: hsl(144.9, 80.4%, 10%);

  /* 暗色模式次要颜色 */
  --secondary: hsl(240, 3.7%, 15.9%);
  --secondary-foreground: hsl(0, 0%, 98%);

  /* 暗色模式静默颜色 */
  --muted: hsl(0, 0%, 15%);
  --muted-foreground: hsl(240, 5%, 64.9%);

  /* 暗色模式强调色 */
  --accent: hsl(12, 6.5%, 15.1%);
  --accent-foreground: hsl(0, 0%, 98%);

  /* 暗色模式破坏性颜色 */
  --destructive: hsl(0, 62.8%, 30.6%);
  --destructive-foreground: hsl(0, 85.7%, 97.3%);

  /* 暗色模式界面元素 */
  --border: hsl(240, 3.7%, 15.9%);
  --input: hsl(240, 3.7%, 15.9%);
  --ring: hsl(142.4, 71.8%, 29.2%);

  /* 暗色模式图表颜色 */
  --chart-1: hsl(220, 70%, 50%);
  --chart-2: hsl(160, 60%, 45%);
  --chart-3: hsl(30, 80%, 55%);
  --chart-4: hsl(280, 65%, 60%);
  --chart-5: hsl(340, 75%, 55%);
}

/* 夏季主题 - 活力明亮 */
.theme-light-summer {
  /* 基础色 */
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(240, 10%, 3.9%);

  /* 卡片颜色 */
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(240, 10%, 3.9%);

  /* 弹出层 */
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(240, 10%, 3.9%);

  /* 主品牌色 */
  --primary: hsl(346.8, 77.2%, 49.8%);        /* 亮红色系 */
  --primary-foreground: hsl(355.7, 100%, 97.3%); /* 配套浅色 */

  /* 辅助色 */
  --secondary: hsl(240, 4.8%, 95.9%);
  --secondary-foreground: hsl(240, 5.9%, 10%);

  /* 中性色 */
  --muted: hsl(240, 4.8%, 95.9%);
  --muted-foreground: hsl(240, 3.8%, 46.1%);

  /* 强调色 */
  --accent: hsl(240, 4.8%, 95.9%);
  --accent-foreground: hsl(240, 5.9%, 10%);

  /* 警告色 */
  --destructive: hsl(0, 84.2%, 60.2%);       /* 标准红色 */
  --destructive-foreground: hsl(0, 0%, 98%);

  /* UI元素 */
  --border: hsl(240, 5.9%, 90%);
  --input: hsl(240, 5.9%, 90%);
  --ring: hsl(346.8, 77.2%, 49.8%);          /* 与主色一致 */

  /* 图表色 */
  --chart-1: hsl(12, 76%, 61%);  /* 橙红色 */
  --chart-2: hsl(173, 58%, 39%); /* 青绿色 */
  --chart-3: hsl(197, 37%, 24%); /* 深蓝色 */
  --chart-4: hsl(43, 74%, 66%);  /* 金黄色 */
  --chart-5: hsl(27, 87%, 67%);  /* 橙黄色 */

  /* 圆角 */
  --radius: 0.5rem;
}
.theme-dark-summer {
  /* 暗色模式基础 */
  --background: hsl(20, 14.3%, 4.1%);       /* 深灰 */
  --foreground: hsl(0, 0%, 95%);            /* 近白色 */

  /* 卡片深色 */
  --card: hsl(24, 9.8%, 10%);
  --card-foreground: hsl(0, 0%, 95%);

  /* 弹出层深色 */
  --popover: hsl(0, 0%, 9%);
  --popover-foreground: hsl(0, 0%, 95%);

  /* 深色主品牌 */
  --primary: hsl(346.8, 77.2%, 49.8%);      /* 保持与亮色模式一致 */
  --primary-foreground: hsl(355.7, 100%, 97.3%);

  /* 深色辅助 */
  --secondary: hsl(240, 3.7%, 15.9%);       /* 深灰蓝 */
  --secondary-foreground: hsl(0, 0%, 98%);

  /* 深色中性 */
  --muted: hsl(0, 0%, 15%);
  --muted-foreground: hsl(240, 5%, 64.9%);

  /* 深色强调 */
  --accent: hsl(12, 6.5%, 15.1%);          /* 暖灰色 */
  --accent-foreground: hsl(0, 0%, 98%);

  /* 深色警告 */
  --destructive: hsl(0, 62.8%, 30.6%);     /* 暗红色 */
  --destructive-foreground: hsl(0, 85.7%, 97.3%);

  /* 深色UI元素 */
  --border: hsl(240, 3.7%, 15.9%);
  --input: hsl(240, 3.7%, 15.9%);
  --ring: hsl(346.8, 77.2%, 49.8%);

  /* 深色图表 */
  --chart-1: hsl(220, 70%, 50%);  /* 蓝色 */
  --chart-2: hsl(160, 60%, 45%); /* 青绿色 */
  --chart-3: hsl(30, 80%, 55%);  /* 橙色 */
  --chart-4: hsl(280, 65%, 60%); /* 紫色 */
  --chart-5: hsl(340, 75%, 55%); /* 玫红色 */
}

/* 秋季主题 - 温暖丰收 */
.theme-light-autumn {
  /* 基础色 */
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(20, 14.3%, 4.1%);

  /* 卡片颜色 */
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(20, 14.3%, 4.1%);

  /* 弹出层 */
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(20, 14.3%, 4.1%);

  /* 主品牌色（橙色系） */
  --primary: hsl(24.6, 95%, 53.1%);
  --primary-foreground: hsl(60, 9.1%, 97.8%);

  /* 辅助色 */
  --secondary: hsl(60, 4.8%, 95.9%);
  --secondary-foreground: hsl(24, 9.8%, 10%);

  /* 中性色 */
  --muted: hsl(60, 4.8%, 95.9%);
  --muted-foreground: hsl(25, 5.3%, 44.7%);

  /* 强调色 */
  --accent: hsl(60, 4.8%, 95.9%);
  --accent-foreground: hsl(24, 9.8%, 10%);

  /* 警告色 */
  --destructive: hsl(0, 84.2%, 60.2%);
  --destructive-foreground: hsl(60, 9.1%, 97.8%);

  /* UI元素 */
  --border: hsl(20, 5.9%, 90%);
  --input: hsl(20, 5.9%, 90%);
  --ring: hsl(24.6, 95%, 53.1%);

  /* 图表色 */
  --chart-1: hsl(12, 76%, 61%);
  --chart-2: hsl(173, 58%, 39%);
  --chart-3: hsl(197, 37%, 24%);
  --chart-4: hsl(43, 74%, 66%);
  --chart-5: hsl(27, 87%, 67%);

  /* 圆角 */
  --radius: 0.5rem;
}
.theme-dark-autumn {
  /* 暗色模式基础 */
  --background: hsl(20, 14.3%, 4.1%);
  --foreground: hsl(60, 9.1%, 97.8%);

  /* 卡片深色 */
  --card: hsl(20, 14.3%, 4.1%);
  --card-foreground: hsl(60, 9.1%, 97.8%);

  /* 弹出层深色 */
  --popover: hsl(20, 14.3%, 4.1%);
  --popover-foreground: hsl(60, 9.1%, 97.8%);

  /* 深色主品牌（暗橙色） */
  --primary: hsl(20.5, 90.2%, 48.2%);
  --primary-foreground: hsl(60, 9.1%, 97.8%);

  /* 深色辅助 */
  --secondary: hsl(12, 6.5%, 15.1%);
  --secondary-foreground: hsl(60, 9.1%, 97.8%);

  /* 深色中性 */
  --muted: hsl(12, 6.5%, 15.1%);
  --muted-foreground: hsl(24, 5.4%, 63.9%);

  /* 深色强调 */
  --accent: hsl(12, 6.5%, 15.1%);
  --accent-foreground: hsl(60, 9.1%, 97.8%);

  /* 深色警告 */
  --destructive: hsl(0, 72.2%, 50.6%);
  --destructive-foreground: hsl(60, 9.1%, 97.8%);

  /* 深色UI元素 */
  --border: hsl(12, 6.5%, 15.1%);
  --input: hsl(12, 6.5%, 15.1%);
  --ring: hsl(20.5, 90.2%, 48.2%);

  /* 深色图表 */
  --chart-1: hsl(220, 70%, 50%);
  --chart-2: hsl(160, 60%, 45%);
  --chart-3: hsl(30, 80%, 55%);
  --chart-4: hsl(280, 65%, 60%);
  --chart-5: hsl(340, 75%, 55%);
}

/* 冬季主题 - 冷冽纯净 */
.theme-light-winter {
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(222.2, 84%, 4.9%);
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(222.2, 84%, 4.9%);
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(222.2, 84%, 4.9%);
  --primary: hsl(221.2, 83.2%, 53.3%);
  --primary-foreground: hsl(210, 40%, 98%);
  --secondary: hsl(210, 40%, 96.1%);
  --secondary-foreground: hsl(222.2, 47.4%, 11.2%);
  --muted: hsl(210, 40%, 96.1%);
  --muted-foreground: hsl(215.4, 16.3%, 46.9%);
  --accent: hsl(210, 40%, 96.1%);
  --accent-foreground: hsl(222.2, 47.4%, 11.2%);
  --destructive: hsl(0, 84.2%, 60.2%);
  --destructive-foreground: hsl(210, 40%, 98%);
  --border: hsl(214.3, 31.8%, 91.4%);
  --input: hsl(214.3, 31.8%, 91.4%);
  --ring: hsl(221.2, 83.2%, 53.3%);
  --radius: 0.5rem;
  --chart-1: hsl(12, 76%, 61%);
  --chart-2: hsl(173, 58%, 39%);
  --chart-3: hsl(197, 37%, 24%);
  --chart-4: hsl(43, 74%, 66%);
  --chart-5: hsl(27, 87%, 67%);
}
/* 冬季主题 - 冷冽纯净 */
.theme-dark-winter {
  --background: hsl(222.2, 84%, 4.9%);
  --foreground: hsl(210, 40%, 98%);
  --card: hsl(222.2, 84%, 4.9%);
  --card-foreground: hsl(210, 40%, 98%);
  --popover: hsl(222.2, 84%, 4.9%);
  --popover-foreground: hsl(210, 40%, 98%);
  --primary: hsl(217.2, 91.2%, 59.8%);
  --primary-foreground: hsl(222.2, 47.4%, 11.2%);
  --secondary: hsl(217.2, 32.6%, 17.5%);
  --secondary-foreground: hsl(210, 40%, 98%);
  --muted: hsl(217.2, 32.6%, 17.5%);
  --muted-foreground: hsl(215, 20.2%, 65.1%);
  --accent: hsl(217.2, 32.6%, 17.5%);
  --accent-foreground: hsl(210, 40%, 98%);
  --destructive: hsl(0, 62.8%, 30.6%);
  --destructive-foreground: hsl(210, 40%, 98%);
  --border: hsl(217.2, 32.6%, 17.5%);
  --input: hsl(217.2, 32.6%, 17.5%);
  --ring: hsl(224.3, 76.3%, 48%);
  --chart-1: hsl(220, 70%, 50%);
  --chart-2: hsl(160, 60%, 45%);
  --chart-3: hsl(30, 80%, 55%);
  --chart-4: hsl(280, 65%, 60%);
  --chart-5: hsl(340, 75%, 55%);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}

.no-visible-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}

.no-visible-scrollbar::-webkit-scrollbar {
  display: none;
}
.root-background{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
}
.root-routes{
  /*position: absolute;*/
  width: 100%;
  z-index: 40;
}
.md-editor-preview{
  position: initial !important;
  height: auto !important;
  box-shadow: none !important;
}
.md-editor-preview .w-md-editor-content{
  position: initial !important;
  border: none !important;
}
.md-editor-preview .w-md-editor-preview{
  position: initial !important;
  padding: 0 !important;
  border: none !important;
}
.md-editor-preview .w-md-editor-bar{
  display: none !important;
}
.xt-root{
  overflow: hidden;
}
html{
  height: auto !important;
}
#trancy-button{
  position: fixed;
  left: 0;
  bottom: 0;
}

